<%@page import="java.util.List"%>
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>我的报修</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta name="description" content="北京规划院 移动办公 OA 自动化">
		<link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
		<link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.1.1/css/jquery-weui.min.css">
		<script src="${base}/js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
		<title>我的报修单</title>
		<%
		    String userid=(String)request.getAttribute("loginuser");		  
		%>
		<style type="text/css">
			.weui-panel {
				margin-top: 0;
				float: left;
				width: 100%;
			}
			
			.weui-select {
				height:100%;
				width: 90%;
				line-height: 100%;
				text-align:center;
				margin-left:15%;
				box-sizing: border-box;
				padding-left:12px;
			}
			.select {
				width: 25%;
				height:44px;
				border: 1px solid #ddd;
				box-sizing: border-box;
				float: left;
				background-color: #eee;
			}
		</style>
	</head>

	<body>
		<div class="select">
			<select class="weui-select" name="status" id="status">
				<option value="A">全部</option>
				<option value="B">进行中</option>
				<option value="C">已完成</option>
				<option value="D">已取消</option>
			</select>
		</div>
		<div class="weui-search-bar" id="searchBar" style="float: right;width: 75%;">
			<span style="font-size: 18px;margin: 0 auto;">报修列表</span>
		</div>
		<div class="weui-panel weui-panel_access">
			<div class="weui-panel__bd" id="bxlist">
			</div>
		</div>
		<script type="text/javascript" class="searchbar js_show">

			function parseURL(url) {
				if(url.indexOf("?") == -1) return
				var url = url.split("?")[1];
				var res = [];
				if(url.indexOf("&") == -1) {
					var arr = url.split("=");
					res[arr[0]] = arr[1]
				} else {
					var arr = url.split("&");
					for(var i = 0; i < arr.length; i++) {
						var key = arr[i].split("=");
						res[key[0]] = key[1]
					}
				}
				return res
			}
			var url2 = window.location.href;
			url2 = decodeURIComponent(url2)
			var res = parseURL(url2)
			//alert(res);
			if(res != undefined) {
				$("#status").val(res.status)
				getList(res.status)
			}else{
				getList("A")
			}
			//获取状态
			function getList(type){
				if(type=="A"){   //全部信息
					var url="listAllByUser";
				}else if(type=="B"){ //进行中  
					var url="listAllByParamAndUser?status=A";
				}else if(type=="C"){ //已完成
					var url="listAllByParamAndUser?status=B";
				}else if(type=="D"){ //已取消
					var url="listAllByParamAndUser?status=C";
				}
				$.post(url,function(data){
					var html="";
					for(var i=0;i<data.length;i++){   //可能需显示报修提交的时间，数据库需加入该字段；
						html+='<div class="weui-media-box weui-media-box_text" data-id='+data[i].id+'>';
						html+='<h4 class="weui-media-box__title">'+data[i].bxdetail.slice(0,8)+'</h4>';
						html+='<p class="weui-media-box__desc" style="margin-bottom: 10px;">提交时间                  '+data[i].dt_create+'</p>'     //提交时间命名可能不一致
						html+='<p class="weui-media-box__desc">报修位置：         '+data[i].bxposition+'</p>'
						if(data[i].status=="A"){
							var status="进行中"
						}else if(data[i].status=="B"){
							var status="已完成"
						}else if(data[i].status=="C"){
							var status="已取消"
						}
						html+='<p class="weui-media-box__desc">报修状态：         '+status+'</p></div>'
					}
					$("#bxlist").html(html)
				})
			}
			$("#status").change(function(){
				getList($(this).val())
			})
			$("#bxlist").on("click",".weui-media-box",function(){
				var id=$(this).attr("data-id");
				location.href="bxxq?id="+id
			})
			//不适用 ${base}跳转
		</script>
	</body>

</html>